<template>
  <div id="app">
    <router-view/>
  </div>
</template>

<script>
export default {
  name: 'App',
	data(){
    return{

    }
	},
	provide(){
		
  },
  
	methods: { //组件的中的方法，可以在组件中使用，包括在标签中

     
    }
}

</script>

<style>

</style>



<!--
<template>
    <a-layout id="components-layout-demo-custom-trigger" :style="{ height: '100vh'}">
      <a-layout-sider :trigger="null" collapsible v-model="collapsed">
        <div class="logo">
          <img src="./assets/logo.png" />
          <h1>Antd Demo</h1>
        </div>

        <a-menu @click="handleClick" theme="dark" mode="inline" :defaultSelectedKeys="['1']">
          <a-menu-item key>
            <a-icon type="user" />
            <span>首页控制台</span>
          </a-menu-item>

          <a-menu-item key = "hotelManager/Manager">
            <a-icon type="user" />
            <span>首页控制台</span>
          </a-menu-item>

          <a-menu-item key="user">
            <a-icon type="pie-chart" />
            <span>用户模块</span>
          </a-menu-item>

          <a-menu-item key="order">
            <a-icon type="upload" />
            <span>订单模块</span>
          </a-menu-item>

          <a-sub-menu @click="handleClick" theme="dark" mode="inline" :defaultSelectedKeys="['1']">
            <span slot="title"><a-icon type="user" />订单模块</span>
            <a-menu-item key="hotelManager/checkInAndOutMgmt">开退房管理</a-menu-item>
            <a-menu-item key="hotelManager/historyRecord">历史记录查询</a-menu-item>
            <a-menu-item key="hotelManager/incomeStatistics">收入汇总</a-menu-item>
            <a-menu-item key="hotelManager/roomMgmt">房间信息管理</a-menu-item>
            <a-menu-item key="hotelManager/Manager">Test</a-menu-item>
          </a-sub-menu>
        </a-menu>
      </a-layout-sider>
      <a-layout>
        <a-layout-header style="background: #fff; padding: 0">
          <a-icon
            class="trigger"
            :type="collapsed ? 'menu-unfold' : 'menu-fold'"
            @click="()=> collapsed = !collapsed"
            style="float:left; padding: 0 ;margin: 15px"
          />

          <!--登录按钮，dialogFormVisible控制着下方的dialog是否显示出来
          <el-button round @click="dialogVisible  = true" style="float:right;margin: 15px">登录你的账号</el-button>
          <el-dialog
            title="登录你的账号"
            :visible.sync="dialogVisible"
            width="30%"
            :before-close="handleClose"
            center
          >
            <login>
            </login>
            <el-dialog width="30%" title="内层 Dialog" :visible.sync="innerVisible" append-to-body></el-dialog>
              <div slot="footer" class="dialog-footer">
                <el-button type="text" @click="dialogVisible = false">取 消</el-button>
                <el-button type="text" @click="innerVisible = true">注册</el-button>
              </div>
            
          </el-dialog>
        </a-layout-header>

        <a-layout-content
          :style="{ margin: '24px 16px', padding: '24px', background: '#fff', minHeight: '280px' }"
        >
          <router-view/>
          
        </a-layout-content>
      </a-layout>
    </a-layout>
</template>


<script>
import index_login from "./components/user/login/index_login";
import login from "./components/user/login/login";
export default {

  name: "App",
  data() {
    return {
      collapsed: false,
      dialogVisible: false,
      innerVisible: false
    };
  },
  components: {
    "login-dialog": index_login,
    login
  },
  methods: {
    handleClick(e) {
      this.$router.push("/" + e.key);
    },
    openDialog() {
      this.visible = true; // 通过data显式控制dialog
    },
    handleClose(done) {
      this.$confirm("确认关闭？")
        .then(_ => {
          done();
        })
        .catch(_ => {});
    }
  }
};
</script>

<style>
.logo img,
.logo svg {
  height: 32px;
  width: 32px;
}
.logo img,
.logo svg,
.logo h1 {
  display: inline-block;
  vertical-align: middle;
}

.logo h1 {
  color: #fff;
  font-size: 20px;
  margin: 0 0 0 12px;
  font-family: Avenir, Helvetica Neue, Arial, Helvetica, sans-serif;
  font-weight: 600;
  vertical-align: middle;
}
.logo {
  position: relative;
  height: 32px;
  left: 0px;
  overflow: hidden;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}

#app {
  font-family: "Avenir", Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color: #2c3e50;
}

#components-layout-demo-custom-trigger .trigger {
  font-size: 18px;
  line-height: 64px;
  padding: 0 24px;
  cursor: pointer;
  transition: color 0.3s;
}

#components-layout-demo-custom-trigger .trigger:hover {
  color: #1890ff;
}

#components-layout-demo-custom-trigger .logo {
  height: 32px;
  background: #02101f;
  margin: 16px;
}

#components-layout-demo-custom-trigger . {
  height: 32px;
  background: #02101f;
  margin: 16px;
}
</style>